<template>
  <!-- 分包商责任区域管理 -->
  <base-breadcrumb>
    <!-- 搜索 -->
    <searchData :searchData="searchArr" @search="search"></searchData>
    <a-card :bordered="false" style="over-flow: scroll">
      <!-- <title-name title="分包商责任区域管理"></title-name> -->
      <div>
        <!-- 表格 -->
        <list-table
          ref="table"
          tableLayout="fixed"
          size="default"
          rowKey="projectId"
          :columns="columns"
          :request="loadData"
          :alert="true"
          :isScrollX="false"
          show-size-changer
          show-quick-jumper
          showPagination="auto"
        >
          <span slot="action" slot-scope="text, record">
            <template>
              <!-- 管理责任区域 -->
              <a @click="handleManage(record, 'view')">管理责任区域</a>
              <!-- <a v-btnPermission="'qm_025_edi_07'" @click="handleManage(record, 'view')">管理责任区域</a> -->
            </template>
          </span>
        </list-table>
      </div>
    </a-card>
  </base-breadcrumb>
</template>

<script>
import { STable } from '@/components' // 表格
import { manage } from '@/api/quality/currency' // api
import SelectProject from '@/components/Select/SelectProject' // 项目名称
import SelectSubCompany from '@/components/Select/SelectSubCompany' // 公司名称
import OrgTreeSelect from '@/components/OrgTreeSelect'

export default {
  name: 'a' + Date.now(),
  components: {
    STable
  },
  props: {
    type: [Number, String]
  },
  data() {
    return {
      columns: [
        {
          title: '分公司名称',
          dataIndex: 'branchCompanyName',
           width: 150,
        },
        {
          title: '项目名称',
          dataIndex: 'projectName',
          width: 150,
        },
        {
          title: '责任区域数量',
          dataIndex: 'dutyAreaNumber',
          width: 150,
        },
        {
          title: '操作',
          dataIndex: 'action',
          width: 150,
          scopedSlots: { customRender: 'action' }
        }
      ],
      searchArr: [
        // 搜索框
        {
          name: '所属单位',
          valueKey: 'searchQuery',
          type: OrgTreeSelect,
        },
        // {
        //   name: '分公司',
        //   valueKey: 'branchCompanyId',
        //   type: SelectSubCompany
        // },
        // {
        //   name: '项目名称',
        //   valueKey: 'projectId',
        //   type: SelectProject
        // }
      ],
      queryParam: {},
      // 加载数据方法 必须为 Promise 对象
      loadData: (parameter) => {
        const requestParameters = Object.assign({}, parameter, this.queryParam)
        return manage.postList(requestParameters).then((res) => {
          return res
        })
      }
    }
  },
  methods: {
    // 搜索
    search(value) {
      this.queryParam = value
      this.$refs.table.refresh(true)
    },
    // 操作栏
    handleManage(record, type) {
      this.$router.push({
        path: [
          '/quality/currency/subcontractorsDistrictSetting',
          '/safetySupervision/currency/subcontractorsDistrictSetting'
        ][this.type],
        query: {
          type: this.type,
          id: record.projectId,
          branchCompanyId: record.branchCompanyId
        }
      })
    }
  }
}
</script>

<style scoped>
.input {
  width: 100%;
}

.notShow {
  display: none;
}
</style>
